<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/style/admin.css" media="all">
    <link rel="stylesheet" href="/style/edit-table.css" media="all" />
</head>

<body>
    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">备件领用单</div>
                    <div class="layui-card-body">
                        <div style="margin-bottom: 10px;">
                            <div class="layui-input-item" style="float:left;padding-right:10px;">
                                <form class="layui-form layui-row layui-col-space16">
                                    <div class="layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">单据号</label>
                                            <div class="layui-input-block">
                                                <input id="no" type="text" class="layui-input">
                                            </div>

                                        </div>
                                    </div>
                                    <div class="layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">领用人</label>
                                            <div class="layui-input-block">
                                                <input id="use-by" type="text" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">领用原因</label>
                                            <div class="layui-input-block">
                                                <input type="text" id="purpose" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">操作人</label>
                                            <div class="layui-input-block">
                                                <input type="text" id="create-by" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md4">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">单据时间</label>
                                            <div class="layui-input-block">
                                                <input type="text" id="create-time" class="layui-input">
                                            </div>

                                        </div>
                                    </div>
                                </form>
                            </div>

                            <div style="clear:both;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">领用出库单明细</div>
                    <div class="layui-card-body">
                        <div style="margin-bottom: 10px;">
                            <div style="clear:both;"></div>
                        </div>
                        <table class="layui-hide" id="item-table" lay-filter="item-table"></table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script src="/layui/layui.js"></script>
    <script src="/js/common.js"></script>
    <script>

        layui.config({
            base: '/' //静态资源所在路径
        }).extend({
            index: 'lib/index' //主入口模块
        }).use(['index', 'table', 'form', 'laydate'], function () {
            var $ = layui.$;
            var table = layui.table;
            var form = layui.form;
            var id = getParam("id");
            var no = getParam("no");

            //加载备件库
            loadOrderInfo(function (data) {
                $('#no').val(data.no);//领用出库单号
                $('#use-by').val(data.useBy);//领用人
                $('#purpose').val(data.purpose);//领用原因
                $('#create-by').val(data.createBy);//操作人
                $('#create-time').val(data.createTime);//单据时间
                table.render({
                    elem: '#item-table',
                    data: data.items,
                    cols: [[
                        { type: 'checkbox' },
                        {
                            title: '序号', width: 60, templet: function (d) {
                                return d.LAY_TABLE_INDEX + 1;
                            }
                        },
                        { field: 'name', width: 200, title: '备件名称' },
                        { field: 'brand', width: 150, title: '品牌' },
                        { field: 'model', width: 150, title: '型号/规格' },
                        { field: 'quantity', width: 100, title: '数量' },
                        { field: 'unit', width: 100, title: '单位', align: 'center' },
                        { field: 'note', title: '备注' }
                    ]],
                });
            });

            function loadOrderInfo(callback) {
                let url = '';
                if (id) {
                    url = '/sparepart-use-orders/' + id;
                } else if (no) {
                    url = '/sparepart-use-orders/no/' + no;
                }
                $.get(url, function (result) {
                    if (callback) {
                        callback(result.data);
                    }
                });
            }


        });
    </script>
</body>

</html>